<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>详情页</title>
  <link rel="stylesheet" href="../css/normalize.css">
  <link rel="stylesheet" href="../css/common.css">
  <link rel="stylesheet" href="../css/head.css">
  <link rel="stylesheet" href="../css/details.css">
  <link rel="stylesheet" href="../css/base.css">
  <script src="../lib/jquery.min.js"></script>

  <script src="../js/jquery.jqzoom.js"></script>
  <script src="../js/base.js"></script>
  <script src="../js/details.js"></script>


</head>

<body style="height: 500px;">
  <!-- 头部 -->
  <div class="head ">
    <div class="container-fluid bgc00">
      <div class="head-top container clearfix">
        <p class="text-left">乐购www.legou.com</p>
        <p class="text-mid">欢迎光临乐购 请
          <a href="../html/login.html">登录</a>
          <span>|</span>
          <a href="../html/register.html">注册</a>

        </p>

      </div>
    </div>
    <div class="head-nav container">
      <div class="logo">
        <img src="../images/logo_00.png" alt="">
      </div>
      <form class="search">
        <input class="input1" type="text" placeholder="请输入搜索的商品名">
        <input class="input2" type="submit" value="">
        <img src="../images/搜索.png" alt="">
      </form>
      <div class="shop">
        <img src="../images/购物车.png" alt="">
        <span><a href="../html/carts.html">购物车</a></span>
        <div class="yuan">0</div>
      </div>

    </div>


  </div>
  <!-- 广告图 -->
  <div class="banner container-fluid ">
    <img src="../images/4-banner.jpg" alt="">
  </div>

  <!--放大镜  -->
  <div>
    <div class="right-extra" style="margin:15px;">
      <!--产品参数开始-->
      <div>
        <div id="preview" class="spec-preview"> <span class="jqzoom"><img jqimg="../images/b1.jpg"
              src="../images/s1.jpg" /></span> </div>
        <!--缩图开始-->
        <div class="spec-scroll"> <a class="prev">&lt;</a> <a class="next">&gt;</a>
          <div class="items">
            <ul>
              <li><img alt="佳能" bimg="../images/b1.jpg" src="../images/s1.jpg" onmousemove="preview(this);"></li>
              <li><img alt="佳能" bimg="../images/b2.jpg" src="../images/s2.jpg" onmousemove="preview(this);"></li>
              <li><img alt="佳能" bimg="../images/b3.jpg" src="../images/s3.jpg" onmousemove="preview(this);"></li>
              <li><img alt="佳能" bimg="../images/b1.jpg" src="../images/s1.jpg" onmousemove="preview(this);"></li>
              <li><img alt="佳能" bimg="../images/b3.jpg" src="../images/s3.jpg" onmousemove="preview(this);"></li>
              <li><img alt="佳能" bimg="../images/b1.jpg" src="../images/s1.jpg" onmousemove="preview(this);"></li>
              <li><img alt="佳能" bimg="../images/b2.jpg" src="../images/s2.jpg" onmousemove="preview(this);"></li>
              <li><img alt="佳能" bimg="../images/b1.jpg" src="../images/s1.jpg" onmousemove="preview(this);"></li>
              <li><img alt="佳能" bimg="../images/b2.jpg" src="../images/s2.jpg" onmousemove="preview(this);"></li>
              <li><img alt="佳能" bimg="../images/b2.jpg" src="../images/s2.jpg" onmousemove="preview(this);"></li>
              <li><img alt="佳能" bimg="../images/b1.jpg" src="../images/s1.jpg" onmousemove="preview(this);"></li>
              <li><img alt="佳能" bimg="../images/b2.jpg" src="../images/s2.jpg" onmousemove="preview(this);"></li>
            </ul>
          </div>
        </div>
        <!--缩图结束-->
      </div>
      <!--产品参数结束-->
      <div style="clear:both;height:10px;"></div>
      <div class="m" id="comment">
        <ul class="tab clearfix" >
          <li onclick="tabs('#comment',0)" class="curr">产品详情<strong></strong><span></span></li>
          <li onclick="tabs('#comment',1)">累积评价<strong>(10915)</strong><span></span></li>
        </ul>
        <div class="mc tabcon hide" style="display:block;">
          <div class="norecode container">
            <img src="../images/a.jpg" alt="">
            <img class="longpic" src="../images/b.jpg" alt="">
             <!-- 猜你喜欢 -->
             <div class="like">
                  <p class="like-p">猜你喜欢</p> 
                  <ul>
                    <li><img src="../images/feij_03.jpg" alt=""></li>
                    <li><img src="../images/feij_03.jpg" alt=""></li>
                    <li><img src="../images/feij_03.jpg" alt=""></li>
                    <li><img src="../images/feij_03.jpg" alt=""></li>
                  </ul>
            </div>
          </div>
        </div>
        <div class="mc tabcon hide" style="display:none;">
          <div class="item container">
            <p class="item-one "><img src="../images/11.jpg" alt=""></p>
            <div class="select">
              <input type="checkbox" name="all" id="">全选
              <input type="checkbox" name="append" id="">追加(12)
              <input type="checkbox" name="pic" id="">图片(93)
              <select>
                <option value="" selected>按默认</option>
                <option value="">啊啊啊</option>
              </select>
             
            </div>
            <!-- 评论 -->
            <div class="mess container" >
              <img src="../images/评论_03.jpg" alt="">
              <img src="../images/评论_03.jpg" alt="">
              <img src="../images/评论_03.jpg" alt="">
              <img src="../images/评论_03.jpg" alt="">
              <img src="../images/评论_03.jpg" alt="">
              <img src="../images/评论_03.jpg" alt="">
              <img src="../images/评论_03.jpg" alt="">
              <img src="../images/评论_03.jpg" alt="">
              <img src="../images/评论_03.jpg" alt="">
              <img src="../images/评论_03.jpg" alt="">
              <img src="../images/评论_03.jpg" alt="">
              <img src="../images/评论_03.jpg" alt="">
              <!-- 猜你喜欢 -->
              <div class="like">
                <p class="like-p">猜你喜欢</p> 
                <ul>
                  <li><img src="../images/feij_03.jpg" alt=""></li>
                  <li><img src="../images/feij_03.jpg" alt=""></li>
                  <li><img src="../images/feij_03.jpg" alt=""></li>
                  <li><img src="../images/feij_03.jpg" alt=""></li>
                </ul>
          </div>
            </div>


          </div>
        </div>
      </div>
    </div>

    <!-- 介绍 -->
    <div class="introduce" style="height: 480px; width: 600px;">
      <h2 class="fs20">【新品首发】DJI 大疆RoboMaster S1 机甲大师 S1专业教育机器人</h2>
      <p class="text red fs16">寓教于乐，玩出名堂</p>
      <p class="img"><img src="../images/4-详情页_07.jpg" alt=""></p>
      <p class="freight">运费:&emsp;&emsp;江苏苏州 至 成都&emsp;快递: 0.00</p>
      <div class="sales">
        <ul>
          <li>
            <p>月销量<span class="red fs18">2871</span></p>
          </li>
          <li>
            <p>累积评价<span class="red fs18">10915</span></p>
          </li>
          <li>
            <p>送积分<span class="red fs18">300</span>起</p>
          </li>
        </ul>
      </div>
      <div class="num">
        <p>数量</p><span class="reduce">-</span><input class="num1" type="text" value="1"><span class="add">+</span>
      </div>

      <div class="buy">
        <input class="gobuy" type="submit" value="立即购买">
        <p><input class="addcars" type="submit" value="加入购物车"><img class="shop" src="../images/购物车空.png" alt=""></p>
      </div>
      <p class="buy-text">服务承诺: 正品保证&emsp;急速退款&emsp;赠运费险&emsp;七天无理由退换&emsp;支付方式</p>
    </div>

    <!-- 翻页 -->
    <div class="page">
      <input class="page-top" type="submit" value="上一页">
      <input class="page-num" type="submit" value="1">
      <input class="page-num" type="submit" value="2">
      <input class="page-num" type="submit" value="3">
      <input class="page-num" type="submit" value="...">
      <input class="page-top" type="submit" value="下一页">
      <input class="page-top" type="submit" value="末页">
    </div>

    <!-- 尾部 -->
    <div class="footer container-fluid ">
      <div class="foot-top container">
        <div class="foot-pic">
          <ul>
            <li><img class="fl mr" src="../images/正品保障.jpg" alt="">
              <p class="fs20 c33 pb10 fw">正品保障</p>
              <p>正品行货 放心选购</p>
            </li>
            <li><img class="fl mr" src="../images/包邮.jpg" alt="">
              <p class="fs20 c33 pb10 fw">满86包邮</p>
              <p>满86元 免运费</p>
            </li>
            <li><img class="fl mr" src="../images/售后无忧.jpg" alt="">
              <p class="fs20 c33 pb10 fw">售后无忧</p>
              <p>7天无理由退货</p>
            </li>
            <li><img class="fl mr" src="../images/准时.jpg" alt="">
              <p class="fs20 c33 pb10 fw">准时送达</p>
              <p>收获时间由你做主</p>
            </li>
          </ul>
        </div>
        <div class="foot-bottom ">
          <div>
            <ul class="one">
              <li><a class="fs18 fw" href="#">新手入门</a></li>
              <li><a href="#">购物流程</a></li>
              <li><a href="#">会员制度</a></li>
              <li><a href="#">订单查询</a></li>
              <li><a href="#">服务协议及隐私说明</a></li>
              <li><a href="#">网站地图</a></li>
            </ul>
          </div>

          <div>
            <ul class="two">
              <li><a class="fs18 fw" href="#">支付方式</a></li>
              <li><a href="#">货到付款</a></li>
              <li><a href="#">网上支付</a></li>
              <li><a href="#">礼品卡支付</a></li>
              <li><a href="#">其他支付</a></li>
            </ul>
          </div>
          <div>
            <ul class="three">
              <li><a class="fs18 fw" href="#">配送服务</a></li>
              <li><a href="#">配送进度查询</a></li>
              <li><a href="#">商品验货与签收</a></li>

            </ul>
          </div>
          <div>
            <ul class="four">
              <li><a class="fs18 fw" href="#">相关规则</a></li>
              <li><a href="#">平台规则</a></li>
              <li><a href="#">退换货政策</a></li>
              <li><a href="#">发票制度</a></li>
              <li><a href="#">帮助中心</a></li>

            </ul>
          </div>

          <div>
            <ul class="five">
              <li><a class=" fw" href="#">App更优惠</a></li>
              <li><img src="../images/二维码.png" alt=""></li>
            </ul>
          </div>
          <div>
            <ul class="six">
              <li><a class=" fw" href="#">加微信查订单</a></li>
              <li><img src="../images/二维码.png" alt=""></li>
            </ul>
          </div>

        </div>

      </div>
      <div class="footer-bottom container">
        <p>沪ICP备XXXXXXXXX号 | 经营证照 | 互联网药品信息服务资格证(沪)-经营性-2017-0006 | 违法和不良信息举报电话：XXX-XXXXXXXX | 沪B2-XXXXXXX |
          沪公网安备 XXXXXXXXX号 | 友情链接 | 出版物经营许可证 | 增值电信业务经营许可证</p>
      </div>
      <div class="footer-pic container">
        <ul>
          <li><img src="../images/footer-1.jpg" alt=""></li>
          <li><img src="../images/footer-2.jpg" alt=""></li>
          <li><img src="../images/footer-3.jpg" alt=""></li>
          <li><img src="../images/footer-4.png" alt=""></li>
          <li><img src="../images/footer-5.png" alt=""></li>
          <li><img src="../images/footer-6.jpg" alt=""></li>
        </ul>
      </div>


    </div>

</body>

</html>